<%/**
 * home.jsp
 * 
 * The navigation hub for the entire project, which also displays a graph of the user's choice.
 *
 * @author Chris Avery
 */%>
 <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@page import="b1w1nn1ng.crossf1t.gui.*"%>
<%@page import="b1w1nn1ng.crossf1t.business.*"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%  
User user = (User) session.getAttribute("user");
session.setAttribute("user", user);
	/*User user;
	
	if (session.getAttribute("user") == null) {
		String username = request.getParameter("username");
		user = User.getUserByUsername(username);
		session.setAttribute("user", user); 
	}
	else {
		user = (User) session.getAttribute("user");
	}*/
	//System.out.println(user.getId());
	String[] temp = Graph.getOptions(user.getId());
	//System.out.println(temp [0] + " " + temp [1]);
%>

<html>
	<head>
		<title> Home Page </title>
		<jsp:include page="/detectBrowser.jsp" />	
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
		<script type="text/javascript" src="highcharts.js"></script>
		<script type="text/javascript" src="gray.js"></script>
	</head>
	<body>
	<div id="container">
		<jsp:include page="/navbar.jsp" />	
		<% if(user != null) { %>
		<h1><%=((String)user.getFirstName())%>'s Home Page </h1> <hr />
		<% } else { %>
		<h1>Home Page </h1> <hr />
		<% } %>
		
		<div class="alignCenter">
		<br>
		

		<table class="icongrid">
			<tr>		

				<td><a href="workoutsMenu.jsp"><img src="/crossfit/img/blackbutton_workouts.png"  alt="Workouts" /></a></td>
				<td><a href="friends.jsp"><img src="/crossfit/img/blackbutton_friends.png"  alt="Friends" /></a></td>
				<td><a href="progress.jsp"><img src="/crossfit/img/blackbutton_progress.png"  alt="Progress" /></a></td>

			</tr>
			<tr>
				<th>Workouts</th>
				<th>Friends</th>
				<th>Progress</th>
			</tr>
			<tr>
				<td><a href="profile.jsp"><img src="/crossfit/img/blackbutton_profile.png" alt="Profile" /></a></td>
				<td><a href="nutrition.jsp"><img src="/crossfit/img/blackbutton_nutrition.png" alt="Nutrition" /></a></td>
				<td><a href="settingsMenu.jsp"><img src="/crossfit/img/blackbutton_settings.png"  alt="Settings" /></a></td>
			</tr>
			<tr>
				<th>Profile</th>
				<th>Nutrition</th>
				<th>Settings</th>
			</tr>
		</table>
		<div id ="container2"></div>
		
		</div>
		</div>

		
<script language ='JavaScript' TYPE="text/javascript">
	var chart;
$(document).ready(function() {
	var options = {
		chart: {
			renderTo: 'container2',
			defaultSeriesType: 'line',
			zoomType: 'x'
			},
		title: {
			text: 'Weight'
			},
		subtitle: {
			text: ''
			},
		xAxis: {
			type: 'datetime',
			maxZoom: 7*24*3600000,
			title:{
				text: 'Day'
			},
	},
		yAxis: {
			startOnTick:false,
			title: {
				text: 'Weight(lbs)'
				}
			},
		tooltip: {
			enabled: false,
			formatter: function() {
			return '<b>'+ this.series.name +'</b><br/>'+
								this.x +': '+ this.y +'°C';
			}
			},
		plotOptions: {
			line: {
			  dataLabels: {
			    enabled: true
				      },
			  enableMouseTracking: false
			       }
			},
		series: [{
			pointInterval:24*3600*1000,
			pointStart:Date.UTC(<%=temp[0]%>),
			name: '<%=((String)user.getFirstName())%>',
			data: [<%=temp[1]%>]
			}]
	}
	chart = new Highcharts.Chart(options);
	//alert(nothing);

});
	</script>		

		</body>
</html>

